import 'scss/bag.scss'
import React from 'react'
import { propName } from 'config/templateConfig'


export default React.createClass({
    getInitialState() {
        return { bag: window.player.bag }
    },
    render() {
        var bag = {},
            itemsNode,
            node
        if (this.state.bag) {
            bag = this.state.bag
            itemsNode = bag.items.map(function (item, index) {
                if (item) {
                    return <div className="item" key={index}>{propName[item.templateId]}X{item.stack}</div>
                } else {
                    return <div className="item" key={index}></div>
                }
            })
        }
        return <div id="bag">
            <div className="head">
                <div className="title">背包</div>
                <div className="title">背包大小{bag.size}空格子{bag.emptySize}</div>
            </div>
            <div className="flex jc-around wrap">{itemsNode}</div>
        </div>
    }
})
